<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>商品卡片布局</title>
		<style>
			/* 思路：1.去除默认外边距【通配选择器】 设置背景颜色 
			        2.product_card 设置样式：内边距，边框设置颜色，加倒角
					加阴影，所有内容--居中：text-align：center
					3.图片边框倒角，外边距？
					4.小米SU7文字：外边框？
					5.￥279999.00 文字大小，外边距？
					6.颜色，外边距？内边距？
			  */
			 #product_card{
				 background-color: #d7dfde;
				 width: 390px;
				 border: #d7dfde;
				 padding: 100px;
			 }
			 #sousuo{
				 width: 200px;
				 height: 20px;
				 border: 1px #00ffff;
				 margin: 300px ;
				 margin: 0 auto;
				 margin-bottom: 100px;
				 
			 }
		</style>
	</head>
	<body>
		<div id="product_card">
		<img src="img/su7.jpg" alt="SU7" width="300px" height="380px"/>
		<h3>小米SU7</h3>
		<p>￥279999.00</p>
		<p>已有<span>10万+</span>人评价</p>
		
		<div id="sousuo">
			<div>
				<p>搜索 京东商品</p>
			</div>
			<div>
				<button>搜索</button>
		</div>
		</div>
	</body>
</html>